<template>
	<view>
		<swiper :indicator-dots="true" :autoplay="true" :interval="3000" circular :duration="1000" :style="getHeight">
			<swiper-item v-for="(swiper,s) in swipers" :key="s">
				<view class="swiper-item">
					<image :src="swiper.src" class="swiper-img" :style="'height:'+height+'rpx'"
						@click="preView()">
					</image>
				</view>
			</swiper-item>
		</swiper>
	</view>
</template>

<script setup>
	import {
		computed
	} from 'vue'
	const props = defineProps({
		swipers: Object | Array,
		height: Number,
		bool:Boolean
	})
	// defineProps(['swipers'])
	// const props = defineProps(['swipers'])
	// console.log('223423',props.swipers);
	const getHeight = computed(() => {
		return `height:${props.height}rpx`
	})
	const getUrls = computed(() => {
		let obj = Object.values(props.swipers)
		return obj.map(item => {
			return item.src
		})
	})

	//预览
	const preView = () => {
		if(props.bool){
			uni.previewImage({
				urls: getUrls.value,
				loop: true,
				fail: () => {
					console.log('加载失败！');
				}
			});
		}else {
			return;
		}
	}
</script>

<style scoped>
	.swiper-img {
		width: 750rpx;

	}
</style>